<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
	<head>
		<meta charset="utf-8"/>
		<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
		<title>后台管理</title>
		<!-- Bootstrap CSS -->
		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"/>
		
		<link rel="stylesheet" type="text/css" th:href="@{/css/backindex.css}"/>
		
		<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
		<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
		<!--[if lt IE 9]>
			<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.2/html5shiv.min.js"></script>
			<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
		<![endif]-->
	</head>
	<body>
		<div th:replace="back/cartoon :: leftbar"></div>
		
		<div class="content">
			<div th:replace="back/cartoon :: navbar"></div>
			
			<ol class="breadcrumb">
			  <li><a th:href="@{/admin/cartoon}">漫画管理</a></li>
			  <li class="active" th:text="${c.name}"></li>
			</ol>
			
			<div class="well">

				<div class="btns">
					<a  class="btn btn-success" th:href="@{/admin/upload(ctId=${c.id})}"><span class="glyphicon glyphicon-plus"></span>&nbsp;&nbsp;新增</a>
				</div>
				
				<div class="panel panel-default">
					<div class="panel-body">
					
						<div class="alert alert-success alert-dismissible el" th:each="p,pStat:${c.chaptors}">
								<button th:data-id="${p.id}" type="button" class="close hide" data-toggle="modal" data-target="#Modal"><span aria-hidden="true">&times;</span></button>
							  <a th:href="@{upload(ctId=${p.ctId},cpId=${p.cpId})}"><b>[[${p.cpId}]]</b>&nbsp;&nbsp;[[${p.name}]]</a>
						</div>
					</div>
				</div>
				
			</div>

		</div>
		
		<div id="Modal" class="modal fade">
		 
		</div>
		
		
		<!-- jQuery -->
		 <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
		<!-- Bootstrap JavaScript -->
		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
		
		
		<script src="/js/backindex.js" type="text/javascript"></script>
	
		<script type="text/javascript" th:inline="javascript">

		
			$(document).ready(function() {
				
				alertRefresh()
				
				$('.alert').on('closed.bs.alert',function(){
					alertRefresh()
				})
				
				$('#Modal').on('show.bs.modal', function (event) {
			    	var button = $(event.relatedTarget)
			    	$(this).empty().append('<div class="modal-dialog modal-sm" ><div class="modal-content">'
				      +'<div class="modal-header">'
				      +'<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span></button>'
				      +'<h3>温馨提示</h3></div>'
				      +'<div class="modal-body">'
				      +'<p class="text-center">确认删除该漫画</p></div>'
				      +'<div class="modal-footer">'
				      +'<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>'
				      +'<button type="button" class="btn btn-danger" onclick="javascript:deleteCartoon('+button.data('id')+')">删除</button>'
				      +'</div></div></div>')
			    });
				
			})
			
			function alertRefresh(){
				var alert=$('.alert')
				alert.last().find('.close').removeClass('hide');
				if($('.alert').length==0){
					$('.panel-body').append('<p class="text-center">暂无章节</p>')
				}
			}
			
			function deleteCartoon(id){
				$.ajax({
			 		url: '/chaptor',
			 		type: 'POST',
			 		data: {
			 			_method: 'DELETE',
			 			id:id,
			 			ctId:[[${c.id}]]
			 		}
			 	})
			 	.done(function() {
			 		$('#Modal').modal('hide')
			 		location.reload() 
			 	})
			 	.fail(function() {
			 		console.log("error");
			 	})
			}
			
		</script>
	</body>
</html>